<template>
    <div class="container">
        <Header class="header" />
        <div class="body">
             <sider-bar></sider-bar>
                <div class="main">
                    <AppMain />
                </div>
        </div>
       
    </div>
</template>
<script>
import appMain from './appMain'
import AppMain from './appMain.vue'
import Header from './header.vue'
import SiderBar from './SiderBar'
export default {
    components:{
        SiderBar,
        Header,
        AppMain 
    }
}
</script>

<style lang="less" scoped>
    .container{
        width: 100%;
        height: 100%;
        display: flex;
        overflow: auto;
        flex-direction: column;
        .body{
            flex: 1;
            width: 100%;
            display: flex;
            padding:35px 25px 0 25px;;
            box-sizing: border-box;;
            .main{
                flex:1;
                margin-left:25px;
                
            }
        }
       
    }
</style>